import React from 'react'
import { useState, useEffect, useLayoutEffect } from 'react'
import ContextChildren from "./ContextChildren"
import NumberContext from '../utils/context'

export default function ContextParent() {
  const [count, setCount] = useState(0)
  // 
  useEffect(() => {
    console.log("useEffect");
  }, [])
  useLayoutEffect(() => {
    console.log("useLayoutEffect");
  })
  return (
    <div>
      <h2>ContextParent</h2>
      <h3>{count}</h3>
      <button onClick={() => setCount(100)}>修改</button>
      <NumberContext.Provider value={count}>
        <ContextChildren></ContextChildren>
      </NumberContext.Provider>
    </div>
  )
}
